<template>
    <div class="sharebox">
        <div class="share">
            <i class="iconfont icon-link" @click="onShare" v-show="isShareIcon"></i>
        </div>
        <div class="sheet">
            <van-share-sheet
            v-model="showShare"
            title="立即分享给好友"
            :options="options"
            @select="onSelect"
            />
        </div>
    </div>
</template>

<script>
import Vue from 'vue';
import { Toast } from 'vant';
Vue.use(Toast);
export default {
    name: 'TopShare',
    props: {
        
    },
    data() {
        return {
            showShare: false,
            options: [
                { name: 'QQ', icon: 'qq' },
                { name: '微信', icon: 'wechat' },
                { name: '微博', icon: 'weibo' },
                { name: '复制链接', icon: 'link' }
            ]
        }
    },
    methods: {
        onShare() {
            this.showShare = !this.showShare
        },
        onSelect(option) {
            if(option.icon == "link") {
                const url = window.location.href
                var input = document.createElement("input")
                input.value = url
                document.body.appendChild(input)
                input.select()
                document.execCommand("Copy")
                document.body.removeChild(input)
                Toast.success('复制成功')
                this.showShare = false
            }
        },
    }
}
</script>

<style scoped>

</style>